<html>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<!-- jQuery.js -->
<script src="<?=$mvc->parse('{base_url}')?>js/jquery-1.6.2.min.js" type="text/javascript"></script>
<script src="<?=$mvc->parse('{base_url}')?>js/jquery-ui-1.8.15.custom.min.js" type="text/javascript"></script>
<script src="<?=$mvc->parse('{base_url}')?>js/jquery.cookie.js" type="text/javascript"></script>
<!-- jQuery.css -->
<link href="<?=$mvc->parse('{base_url}')?>css/smoothness/jquery-ui-1.8.15.custom.css" rel="stylesheet" type="text/css" media="all" />

<!-- main -->
<script src="<?=$this->data_url?>index_stor.js" type="text/javascript" ></script>
<link rel="stylesheet" type="text/css" media="all" href="<?=$this->data_url?>index_stor.css" />

<!-- TinyMCE editor -->
<script src="../assets/plugins/tinymce3201/jscripts/tiny_mce/tiny_mce.js" type="text/javascript"></script>

<!-- Class for selecting files -->
<script src="/myassets/js/myfileselector.js" type="text/javascript"></script>
<!-- Widget for displaying trees. -->
<script src="../myassets/js/TreeWidget.js" type="text/javascript"></script>

<script type="text/javascript" src="../myassets/libs/storage/ctree.js"></script>

<body style="width:100%; height:100%; margin:0; background:#fff">
<!-- Контейнер -->
<table align="center" border="0" width="100%">
	<tr>
		<td class="row_title" width="150px"><?=$mvc->lang->tr('Table name');?></td>
		<td>
			<input type="text" id="stor_name" value="<?=$this->table->name?>"/>
		</td>
	</tr>
	<tr>
		<td>
			<span class="row_title"><?=$mvc->lang->tr('Comment');?></span>
		</td>
		<td>	<input type="text" id="stor_desc" value="<?=$this->table->comment ?>" />
		</td>
	</tr>

	<tr>
		<td valign="top" colspan="2">
			<div class="block_title"><?=$mvc->lang->tr('Fields editor');?></div>
			<table border="1" id="aaa" class="fields_table">
				<tr>
					<td class="row_title"><?=$mvc->lang->tr('Name');?></td>
					<td class="row_title"><?=$mvc->lang->tr('Type');?></td>
					<td class="row_title"><?=$mvc->lang->tr('Length');?></td>
					<td class="row_title"><?=$mvc->lang->tr('Comment');?></td>
					<td>&nbsp;</td>
				</tr>
				<tr style="background: #eee">
					<td><input type="text" name="name" id="field_name" /></td>
					<td>
						<select name="type" id="field_type">
							<option value="int">int</option>
							<option value="float">float</option>
							<option value="char">char</option>
							<option value="varchar">varchar</option>
							<option value="time">time</option>
							<option value="datetime">datetime</option>
							<option value="text">text</option>
						</select>
					</td>
					<td><input type="text" name="len" id="field_len" /></td>
					<td><input type="text" name="comment" id="field_comment" /></td>
					<td width="10px"><a id="btn_set" title="<?=$mvc->lang->tr('Set');?>" onClick="setRow()">asd</a></td>
				</tr>
			</table>
		</td>
	</tr>

	<tr>
		<td colspan="2" align="center">
			<input type="button" value="<?=$mvc->lang->tr('Save');?>" onClick="createStorage()" />
			<input type="button" value="<?=$mvc->lang->tr('Cancel');?>" onClick="document.location='<?=$this->base_url?>'" />
			<input type="button" value="Save&Data" onClick="createStorage('<?=$prelink?>&m0_cmd=data&m0_name=<?=$name?>')" />
		</td>
	</tr>
</table>


<style>
.ui-button *{padding:0}
</style>

<script type="text/javascript">
//	jQuery(function() {

		
		//jQuery('#btn_set').css({'margin':'0px'});
		//jQuery('#btn_set *').css({'padding':'0px'});
		//jQuery(".btn_del").button({icons:{primary:'ui-icon-circle-minus'}, text:false});
		//jQuery("#asas").button({icons:{primary:'ui-icon-circle-check'}, text:false});
//	});


	str = new Array();
	<?
		foreach($this->table->fields as $k => $v)
		{
			echo "str['".$k."'] = {";
			echo "name: '".$v['name']."'";
			echo ", type: '".$v['type']."'";
			echo ", len: '".$v['len']."'";
			echo ", comment: '".$v['comment']."'};";
		}
	?>


	baseTableCode = jQuery('#stor_container').html();

	function updateTable()
	{
		jQuery("#aaa tr[alt]").remove();

		for(var k in str)
		{
			var row = '<tr alt="' + k + '" ';
			row += ' onmouseover="this.style.background=\'#eee\'"';
			row += ' onmouseout="this.style.background=\'\'">';
			row += '<td><a href="javascript:getRow(\'' + str[k].name + '\')">' + k + '</a></td>';
			row += '<td>' + str[k].type + '</td>';
			row += '<td>' + str[k].len + '</td>';
			row += '<td>' + str[k].comment + '</td>';
			row += '<td><a href="javascript:delRow(\'' + k + '\')" class="btn_del"><?=$mvc->lang->tr("Delete")?></a></td>';
			row += '</tr>';
			jQuery("#aaa").append(row);
		}
		jQuery("#aaa .btn_del").button({icons:{primary:'ui-icon-circle-minus'}, text:false}).width('16px').height('16px');
	}

	function getRow(name)
	{
		jQuery('#field_name').val(str[name]['name']);
		jQuery('#field_type').val(str[name]['type']);
		jQuery('#field_len').val(str[name]['len']);
		jQuery('#field_comment').val(str[name]['comment']);
	}

	function setRow()
	{
		var name = jQuery('#field_name').val().trim().toLowerCase();
		if (name != '')
		{
			str[name] = {
				name: jQuery('#field_name').val(),
				type: jQuery('#field_type').val(),
				len: jQuery('#field_len').val(),
				comment: jQuery('#field_comment').val()
			}
		};
		updateTable();
	}

	function delRow(field_name)
	{
		var newStr = Array();
		for (var k in str)
			if (field_name != k) newStr[k] = str[k];
		str = newStr;

		updateTable();
	}

	function addValue(form, name, value)
	{
		form.append('<textarea name="' + name + '">' + value + '</textarea>');
	}

	function createStorage()
	{
		var form = jQuery(document.createElement('form'));
		form.css({'display':'none'});

		form.attr('action', '<?=$this->base_url?>save?name=' + jQuery('#stor_name').val());
		form.attr('method', 'POST');

		//addValue(form, 'm_cmd', 'edtstor2');
		addValue(form, 'name', jQuery('#stor_name').val());
		addValue(form, 'desc', jQuery('#stor_desc').val());

		var i = 0;
		for(var k in str)
		{
			addValue(form, 'stor_f' + i + 'N', str[k]['name']);
			addValue(form, 'stor_f' + i + 'T', str[k]['type']);
			addValue(form, 'stor_f' + i + 'L', str[k]['len']);
			addValue(form, 'stor_f' + i + 'C', str[k]['comment']);
			i++
		}
		addValue(form, 'stor_fcount', i);
		
		jQuery(document.body).append(form);
		form.submit();
	}

	updateTable();
</script>

<script>


//enableModal();

	//   .
	//mfs = MyFileSelector({cont: 'selfile', url: '/myassets/images/fileselector.php', autoHide: true});


	
jQuery(function() {
	/*
		jQuery('#tabs').tabs({
			tabTemplate: "<li><a href='#{href}'>#{label}</a> <span class='ui-icon ui-icon-close'>Remove Tab</span></li>",
			cookie: { expires: 30 },
		}).find( ".ui-tabs-nav" ).sortable({ axis: "x" });;
		
		$( "#tabs span.ui-icon-close" ).live( "click", function() {
			//var index = $( "li", $tabs ).index( $( this ).parent() );
			//jQuery('#tabs').tabs( "remove", index );
			var index = jQuery('#tabs').tabs('option', 'index');
			alert(index.panel);
			//jQuery('#tabs').tabs('url', 0, 'http://localhost:3128/premium/sample-robots.txt');
			//jQuery('#tabs').tabs('load', 0);			
		});
		*/
		
		jQuery('#btn_add').button({icons:{primary:'ui-icon-circle-plus'}, text:false}).width('16px').height('16px');
		jQuery('.btn_edit').button({icons:{primary:'ui-icon-pencil'}, text:false}).width('16px').height('16px');
		jQuery('.btn_del').button({icons:{primary:'ui-icon-trash'}, text:false}).width('16px').height('16px');
		jQuery('.btn_data').button({icons:{primary:'ui-icon-contact'}, text:false}).width('16px').height('16px');
		jQuery('#btn_set').button({icons:{primary:'ui-icon-circle-check'}, text:false}).width('16px').height('16px');
		
		jQuery('a.ui-button._ajax').click(function(event) { event.preventDefault(); loadActTab(this.href); });
});

function loadActTab(url, data)
{
	//var index = jQuery('#tabs').tabs('option', 'selected');
	//alert(index + ' ' + url);
	//jQuery('#tabs').tabs('url', index, url);
	jQuery('#tabs').find('.ui-tabs-panel').not('.ui-tabs-hide').html('loading...');
	jQuery('#tabs').find('.ui-tabs-panel').not('.ui-tabs-hide').load(url, data);
	//jQuery('#tabs').tabs('load', index);	
}

</script>




</body>
</html>